import DataBus from '../databus'
import { SCREEN_WIDTH, SCREEN_HEIGHT } from '../render'

export default class MainMenu {
  constructor() {
    this.isVisible = true
    this.databus = new DataBus()
    
    // 按钮区域 - 优化布局
    this.offlineButton = {
      x: SCREEN_WIDTH / 2 - 100,
      y: SCREEN_HEIGHT / 2 - 40,
      width: 200,
      height: 50
    }
    
    this.aiButton = {
      x: SCREEN_WIDTH / 2 - 100,
      y: SCREEN_HEIGHT / 2 + 20,
      width: 200,
      height: 50
    }
    
    this.onlineButton = {
      x: SCREEN_WIDTH / 2 - 100,
      y: SCREEN_HEIGHT / 2 + 80,
      width: 200,
      height: 50
    }
    
    // 回调函数
    this.offlineGameStartCallback = null
    this.aiGameStartCallback = null
    this.onlineGameStartCallback = null
  }

  render(ctx) {
    if (!this.isVisible) return
    
    // 绘制不透明背景
    ctx.fillStyle = 'rgba(0, 0, 0, 0.85)'
    ctx.fillRect(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)
    
    // 绘制装饰性背景图案
    this.drawBackgroundPattern(ctx)
    
    // 绘制标题区域
    this.drawTitle(ctx)
    
    // 绘制按钮
    this.drawButtons(ctx)
    
    // 绘制说明文字
    this.drawInstructions(ctx)
    
    // 绘制装饰性元素
    this.drawDecorations(ctx)
  }

  drawBackgroundPattern(ctx) {
    // 绘制渐变背景
    const gradient = ctx.createLinearGradient(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)
    gradient.addColorStop(0, 'rgba(102, 126, 234, 0.3)')
    gradient.addColorStop(1, 'rgba(118, 75, 162, 0.3)')
    
    ctx.fillStyle = gradient
    ctx.fillRect(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)
    
    // 绘制装饰性圆点
    ctx.fillStyle = 'rgba(255, 255, 255, 0.1)'
    for (let i = 0; i < 8; i++) {
      const x = (SCREEN_WIDTH / 9) * (i + 1)
      const y = SCREEN_HEIGHT / 4 + Math.sin(Date.now() / 2000 + i) * 20
      
      ctx.beginPath()
      ctx.arc(x, y, 8, 0, 2 * Math.PI)
      ctx.fill()
    }
  }

  drawTitle(ctx) {
    // 绘制主标题
    ctx.fillStyle = '#ffffff'
    ctx.font = 'bold 48px Arial'
    ctx.textAlign = 'center'
    ctx.fillText('中国象棋', SCREEN_WIDTH / 2, SCREEN_HEIGHT / 4)
    
    // 绘制副标题
    ctx.font = '24px Arial'
    ctx.fillStyle = 'rgba(255, 255, 255, 0.8)'
    ctx.fillText('经典双人对战', SCREEN_WIDTH / 2, SCREEN_HEIGHT / 4 + 40)
    
    // 绘制装饰线
    ctx.strokeStyle = 'rgba(255, 255, 255, 0.3)'
    ctx.lineWidth = 2
    ctx.beginPath()
    ctx.moveTo(SCREEN_WIDTH / 2 - 80, SCREEN_HEIGHT / 4 + 60)
    ctx.lineTo(SCREEN_WIDTH / 2 + 80, SCREEN_HEIGHT / 4 + 60)
    ctx.stroke()
  }

  drawButtons(ctx) {
    // 绘制离线游戏按钮
    this.drawButton(ctx, this.offlineButton, '#4CAF50', '#45a049', '双人对战', '#ffffff')
    
    // 绘制人机对战按钮
    this.drawButton(ctx, this.aiButton, '#FF9800', '#F57C00', '人机对战', '#ffffff')
    
    // 绘制在线游戏按钮
    this.drawButton(ctx, this.onlineButton, '#2196F3', '#1976D2', '在线对战', '#ffffff')
  }

  drawButton(ctx, button, color, hoverColor, text, textColor) {
    // 按钮阴影
    ctx.fillStyle = 'rgba(0, 0, 0, 0.3)'
    ctx.fillRect(button.x + 4, button.y + 4, button.width, button.height)
    
    // 按钮背景渐变
    const gradient = ctx.createLinearGradient(button.x, button.y, button.x, button.y + button.height)
    gradient.addColorStop(0, color)
    gradient.addColorStop(1, hoverColor)
    ctx.fillStyle = gradient
    
    // 圆角矩形
    this.drawRoundedRect(ctx, button.x, button.y, button.width, button.height, 12)
    
    // 按钮文字
    ctx.fillStyle = textColor
    ctx.font = 'bold 20px Arial'
    ctx.textAlign = 'center'
    ctx.fillText(text, button.x + button.width / 2, button.y + button.height / 2 + 6)
  }

  drawRoundedRect(ctx, x, y, width, height, radius) {
    ctx.beginPath()
    ctx.moveTo(x + radius, y)
    ctx.lineTo(x + width - radius, y)
    ctx.quadraticCurveTo(x + width, y, x + width, y + radius)
    ctx.lineTo(x + width, y + height - radius)
    ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height)
    ctx.lineTo(x + radius, y + height)
    ctx.quadraticCurveTo(x, y + height, x, y + height - radius)
    ctx.lineTo(x, y + radius)
    ctx.quadraticCurveTo(x, y, x + radius, y)
    ctx.closePath()
    ctx.fill()
  }

  drawInstructions(ctx) {
    ctx.fillStyle = 'rgba(255, 255, 255, 0.7)'
    ctx.font = '16px Arial'
    ctx.textAlign = 'center'
    
    // 游戏说明
    ctx.fillText('点击棋盘落子，落子前需要确认', SCREEN_WIDTH / 2, SCREEN_HEIGHT - 120)
    ctx.fillText('红方先行，将死对方获胜', SCREEN_WIDTH / 2, SCREEN_HEIGHT - 100)
    
    // 版本信息
    ctx.font = '14px Arial'
    ctx.fillStyle = 'rgba(255, 255, 255, 0.5)'
    ctx.fillText('v1.4.4 经典中国象棋', SCREEN_WIDTH / 2, SCREEN_HEIGHT - 40)
  }

  drawDecorations(ctx) {
    // 绘制装饰性棋子图案
    ctx.fillStyle = 'rgba(255, 255, 255, 0.1)'
    
    // 左侧装饰
    for (let i = 0; i < 3; i++) {
      const x = 50 + i * 30
      const y = SCREEN_HEIGHT / 2 + Math.sin(Date.now() / 1500 + i) * 15
      
      ctx.beginPath()
      ctx.arc(x, y, 15, 0, 2 * Math.PI)
      ctx.fill()
    }
    
    // 右侧装饰
    for (let i = 0; i < 3; i++) {
      const x = SCREEN_WIDTH - 50 - i * 30
      const y = SCREEN_HEIGHT / 2 + Math.cos(Date.now() / 1500 + i) * 15
      
      ctx.beginPath()
      ctx.arc(x, y, 15, 0, 2 * Math.PI)
      ctx.fill()
    }
  }

  handleTouch(x, y) {
    if (!this.isVisible) return false
    
    // 检查离线游戏按钮
    if (x >= this.offlineButton.x && x <= this.offlineButton.x + this.offlineButton.width &&
        y >= this.offlineButton.y && y <= this.offlineButton.y + this.offlineButton.height) {
      this.startOfflineGame()
      return true
    }
    
    // 检查人机对战按钮
    if (x >= this.aiButton.x && x <= this.aiButton.x + this.aiButton.width &&
        y >= this.aiButton.y && y <= this.aiButton.y + this.aiButton.height) {
      this.startAIGame()
      return true
    }
    
    // 检查在线游戏按钮
    if (x >= this.onlineButton.x && x <= this.onlineButton.x + this.onlineButton.width &&
        y >= this.onlineButton.y && y <= this.onlineButton.y + this.onlineButton.height) {
      this.startOnlineGame()
      return true
    }
    
    return false
  }

  show() {
    this.isVisible = true
  }

  hide() {
    this.isVisible = false
  }

  startOfflineGame() {
    this.hide()
    // 触发离线游戏开始事件
    if (this.offlineGameStartCallback) {
      this.offlineGameStartCallback()
    }
  }

  startAIGame() {
    this.hide()
    // 触发人机对战开始事件
    if (this.aiGameStartCallback) {
      this.aiGameStartCallback()
    }
  }

  startOnlineGame() {
    this.hide()
    // 触发在线游戏开始事件
    if (this.onlineGameStartCallback) {
      this.onlineGameStartCallback()
    }
  }

  // 设置离线游戏开始回调
  setOfflineGameStartCallback(callback) {
    this.offlineGameStartCallback = callback
  }

  // 设置人机对战开始回调
  setAIGameStartCallback(callback) {
    this.aiGameStartCallback = callback
  }

  // 设置在线游戏开始回调
  setOnlineGameStartCallback(callback) {
    this.onlineGameStartCallback = callback
  }

  update() {
    // 主菜单更新逻辑
  }
} 